<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<script type="text/javascript">
/*
       앨범 span 업~~~~~~
*/
$(document).ready(function() {
 	 $('.boxgrid').each(function(){
		   var $caption = $(this).find('span.cover-boxcaption')	;
		   $(this).hover(
			   function(){
				    $caption.stop(1);
				    $caption.animate({ top: '-110px' });
		       },
		       function(){
     			    $caption.stop(1);
				    $caption.animate({ top: '-9px' });
		       });
	}); 
 });
</script>
<div class="album-bbs-div">
    <ul class="album-bbs-ul">
        <li class="boxgrid">
            <a href="javascript:"> 
                <img src="image/demo.jpg" class="album-bbs-demo-img-src">
                <span class="cover-boxcaption">
                   <span class="albumTitle">ㅋㅋㅋㅋㅋ</span><br> 
                   <span class="albumDate">2013.07.14</span><br> 
                   <span class="albumAuthor">이 상 욱</span> 
                </span> 
            </a>    
        </li>  
        <li class="boxgrid">
            <a href="javascript:imageCheck(this);"> 
                <img src="image/demo.jpg" class="album-bbs-demo-img-src">
                <span class="cover-boxcaption">
                   <span class=""></span> 
                   <span class=""></span> 
                </span> 
            </a>    
        </li>   
        <li class="boxgrid">
            <a href="javascript:imageCheck(this);"> 
                <img src="image/demo.jpg" class="album-bbs-demo-img-src">
                <span class="cover-boxcaption">
                   <span class=""></span> 
                   <span class=""></span> 
                </span> 
            </a>    
        </li>   
        
    </ul> 
    <ul class="album-bbs-ul">
        <li class="boxgrid">
            <a href="javascript:imageCheck(this);"> 
                <img src="image/demo.jpg" class="album-bbs-demo-img-src">
                <span class="cover-boxcaption">
                   <span class=""></span> 
                   <span class=""></span> 
                </span> 
            </a>    
        </li>  
        <li class="boxgrid">
            <a href="javascript:imageCheck(this);"> 
                <img src="image/demo.jpg" class="album-bbs-demo-img-src">
                <span class="cover-boxcaption">
                   <span class=""></span> 
                   <span class=""></span> 
                </span> 
            </a>    
        </li>   
        <li class="boxgrid">
            <a href="javascript:imageCheck(this);"> 
                <img src="image/demo.jpg" class="album-bbs-demo-img-src">
                <span class="cover-boxcaption">
                   <span class=""></span> 
                   <span class=""></span> 
                </span> 
            </a>    
        </li>   
    </ul> 
    <div class="albumPaging">
        <c:forEach var="i" begin="1" end="10" step="1">
            <a href="">${ i } </a> 
        </c:forEach> 
     </div>
    <!-- bbs 하단 바 -->
    <div class="bbsBottom">
        <form name="albumForm">
            <select>
                <option value="1">제목</option>    
                <option value="2">작성자</option>    
                <option value="3">타이틀</option>    
            </select> 
            <input type="text" name="albumSearch" size="20"/>
            <input type="submit" value="검색"/>
        </form>
    </div> 
</div>